<script>
import OrderTable from "@/components/orderTable.vue";
import axios from "axios";
import {getToken} from "@/store/token";

export default {
  name: "myOrder",
  components: {OrderTable},
  data() {
    return {
      state: {
        activeName: ""
      }
    }
  }
}
</script>

<template>
  <div style="position: relative">
    <span style="font-size: 18px;">订单</span>
    <el-tabs v-model="state.activeName">
      <el-tab-pane label="全部订单" name="">
        <order-table :status="state.activeName"></order-table>
      </el-tab-pane>
      <el-tab-pane label="待付款" name="1">
        <order-table v-if="state.activeName==='1'" :status="state.activeName"></order-table>
      </el-tab-pane>
      <el-tab-pane label="待发货" name="2">
        <order-table v-if="state.activeName==='2'" :status="state.activeName"></order-table>
      </el-tab-pane>
      <el-tab-pane label="已发货" name="3">
        <order-table v-if="state.activeName==='3'" :status="state.activeName"></order-table>
      </el-tab-pane>
      <el-tab-pane label="已完成" name="4">
        <order-table v-if="state.activeName==='4'" :status="state.activeName"></order-table>
      </el-tab-pane>
      <el-tab-pane label="已取消" name="5">
        <order-table v-if="state.activeName==='5'" :status="state.activeName"></order-table>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<style scoped>

</style>